from st_on_hover_tabs import on_hover_tabs
from glob import glob
from vimage import image_viewer_page
import streamlit as st
from inference import image_inference

from streamlit_navigation_bar import st_navbar
from fristPage import pages

# 定义导航栏的页面选项
navbar_pages = ["创新技术", "解决方案", "量产应用", "咨询动态", "使用文档"]

# 1. 定义样式字典
styles = {
    "nav": {
        "background-color": "#111111",  # 导航栏背景颜色
        "justify-content": "center",    # 对齐方式
        "height": "6rem",

    },
    "span": {   
        "color": "white",           # 常规文字颜色
        "padding": "1.7rem",
        "font-size": "1.2rem",
    },
    "hover": {
        "background-color": "#111111", # 鼠标悬停时的背景色
        "color": "#FFFFFF",            # 鼠标悬停时的文字色
    },
    "active": {
        "background-color": "#222222", # 激活页面的背景色
        "font-weight": "normal",
    },
}

# 2. 应用样式并创建导航栏
selected_page = st_navbar(navbar_pages, styles=styles)

st.set_page_config(layout="wide")

# 应用自定义样式
st.markdown('<style>' + open('./style.css').read() + '</style>', unsafe_allow_html=True)

# 创建导航栏
with st.sidebar:
# tabs = st.tabs(
#         ['最新功能', '图片查看器', '图片处理', '经济']
#     )
    tabs = on_hover_tabs(
        tabName=['最新功能', '图片查看器', '图片处理', '经济','设置','编辑'], 
        iconName=['dashboard', 'image', 'money', 'economy','settings','edit'], 
        default_choice=0
    )
    

# 根据选择的标签显示不同内容
if tabs == '最新功能':
    
    # st.write("数据集预览功能")
    pages()
    # st.write("大模型图像数据标定")
    # st.write("数据统计自主分析")
    # st.write("模型设置")
    # st.title("导航栏")
    # st.write('当前选项名称是 {}'.format(tabs))

elif tabs == '图片查看器':
    image_viewer_page()

elif tabs == '图片处理':
    image_inference()

elif tabs == '经济':
    st.title("经济分析")
    st.write('当前选项名称是 {}'.format(tabs))

